<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="退款详情" width="750px">
    <Description @register="registerDescription" v-if="detailData" :data="detailData" />
    <Empty v-else></Empty>
  </BasicDrawer>
</template>
<script lang="ts" setup>
  import { ref, useAttrs } from 'vue';
  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
  import { Empty } from 'ant-design-vue';
  import { formDetailSchema } from './refund.data';
  import { getOrder, refundOrder } from './refund.api';
  import { Description, useDescription } from '/@/components/Description/index';
  const emit = defineEmits(['register']);
  const attrs = useAttrs();
  const detailData = ref({});
  const [registerDescription] = useDescription({
    bordered: false,
    // data: mockData,
    schema: formDetailSchema,
    labelStyle: {
      marginLeft: '10px'
    }
  });

  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
    setDrawerProps({ confirmLoading: false });
    setDrawerProps({ confirmLoading: false, loading: true });
    try {
      const record = await getOrder({ refundOrderNo: data.record.refundOrderId }) || {}
      detailData.value = record;
    } finally {
      setDrawerProps({ loading: false })
    }
  });
</script>


<style scoped>

</style>